<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>常用指令：v-on</title>
	<script src="js/vue.js"></script>
	<script>
		window.onload=function(){
			var vm=new Vue({
				el:'#spnice',
				data:{ //数据
					arr:[12,4,24,2]
				},
				methods:{ //方法
					show:function(){
						console.log('show方法');
					},
					add:function(){
						// console.log(this===vm);	//true，this表示当前Vue实例
						this.arr.push(666); //使用this访问当前实例中的成员
					}
				}
			});
		};
	</script>
</head>
<body>
	<div id="spnice">	
		<!-- <button onclick="show()">点我</button> -->
		<button v-on:click="show()">点我</button>
		<button v-on:click="add()">向数组中添加元素</button>
		<br>
		{{arr}}

		<!-- 常用事件：click/mouseover/mouseout/dblclick... -->
		<button v-on:mouseover="show()">鼠标经过</button>
		<button v-on:dblclick="show()">鼠标双击</button>
		

	</div>
</body>
</html>